<template>
  <div class="ware_part">
    <!-- 搜索组件 -->
    <Searcha :plh_a="placeholdera" :plh_b="placeholderb" :url="addurl" :name="name" :enterSearch="showSearch"></Searcha>

    <!-- 表格 -->
    <el-table
    border
	ref="multipleTable"
	:data="tableData"
	tooltip-effect="dark"
	style="width: 100%"
	@selection-change="handleSelectionChange"
    >
    <el-table-column  align="center" type="selection" width="55"> </el-table-column>
    <el-table-column  align="center" prop="name" label="权限名称" width="200" sortable></el-table-column>
    <el-table-column  align="center" prop="code" label="权限CODE" width="200" sortable> </el-table-column>
    <el-table-column  align="center" prop="time" label="修改时间"  sortable width="240"></el-table-column>
    <el-table-column  align="center" prop="updata" label="修改人" width="150" sortable> </el-table-column>
    <el-table-column  align="center" prop="rank" label="权限等级" width="100" sortable> </el-table-column>
    <el-table-column  align="center" label="操作" width="400">
        <template slot-scope="scope">
            <el-button size="mini" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
            <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
            <el-button size="mini" type="primary" @click="raisePower(scope.$index, scope.row)">提升权限</el-button>
            <el-button size="mini" type="info" @click="reducePower(scope.$index, scope.row)">降低权限</el-button>

		</template>
    </el-table-column>
    </el-table>
	<!-- 编辑弹窗 -->
	<Dialog :list="list" :url="url" :name="name"></Dialog>

    <!-- 分页组件 -->
    <Pagination :num="lists.length" :router="router"></Pagination>
  </div>
</template>



<style lang="scss">
	.el-table {
		.el-table_1_column_6 {
			.cell {
				text-align: center;
			}
		}
	}
</style>

<script>
import Pagination from "@c/Pagination";
import Searcha from "@c/Searcha";
import Dialog from "@c/Dialog";

export default {
  components: { Searcha, Pagination, Dialog },
  data() {
    return {
		title: "权限管理",
		placeholdera: "请输入权限名称",
		placeholderb: "请输入权限CODE",
		tableData: [],
        // 总数据
		lists: [],
		list: {},
		name: [ '权限名称', '权限CODE', ],
		// 弹窗
		dialog: false,
		// 路由
        router: '/system/power/',
        // 修改
        url: '/system/power/updata',
        // 增加
        addurl: '/system/power/add',
        // 请求数据
        get:  '/system/power',
        gets: '/system/powers',
        // 删除
        delete: '/system/power/delete',

    };
  },
    created() {
        this.$store.commit("title", this.title);
        
        this.$store.commit('dialog', this.dialog)
        this.getData();
        this.getDatas();

        
    },

  	computed: {
		keyWord() {
            return this.$store.state.keyWord
        }
	},

    methods: {
        showSearch(val) {
        // console.log(val);
        this.$store.commit('updataSearch', val)
    },

    // 请求数据的方法
    getData() {
        let { params } = this.$route
        this.$http.get(this.get, { params })
            .then(({data}) => {
                this.tableData = data
            })
            
    },
    getDatas() {
        this.$http.get(this.gets)
            .then(({data}) => {
                this.lists = data
            })
            
    },
    // 提升权限
    raisePower(index, data) {
        if(data.rank === 0 ) {
            this.$message({
                message: '已为最高权限等级',
                type: 'success'
            })
            return;
        }
        data.rank--;
        this.$http.get('/system/power/rank',{params: { rank: data.rank, _id: data._id }})
            .then(({ data }) => {
                if(!data.errno) {
                    this.$message({
                        message: '已提升权限等级',
                        type: 'success'
                    })
                }else {
                    this.$message({
                        message: '提升权限等级失败',
                        type: 'error'
                    })

                }
            })
    },
    // 降低权限
    reducePower(index, data) {
        if(data.rank === 10 ) {
            this.$message({
                message: '已为最低权限等级',
                type: 'success'
            })
            return;
        }
        data.rank++;
        this.$http.get('/system/power/rank',{params: { rank: data.rank, _id: data._id }})
            .then(({ data }) => {
                if(!data.errno) {
                    this.$message({
                        message: '已降低权限等级',
                        type: 'success'
                    })
                }else {
                    this.$message({
                        message: '降低权限等级失败',
                        type: 'error'
                    })

                }
            })
    },

    handleSelectionChange () {
        
    },
    //   编辑
    handleEdit(index, data) {
        this.$store.state.dialog = true;
        // console.log(data);
        this.list = data;
    },
    //   删除
    handleDelete(index, data) {
        // console.log(data);
        this.$confirm('确定要删除吗？', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
        })
        .then(() => {
            this.$http.get(this.delete, { params: {_id: data._id}})
                .then(({ data }) => {
                    if(!data.errno) {
                        this.$message({
                            message: data.msg,
                            type: 'success'
                        })
                        setTimeout(() => {
                            this.$router.go(0)
                        },1000)
                    }
                })
            }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });          
                });
    }
        
    },
    watch: {
        $route() {
            this.getData()
        },
        keyWord(value) {
            this.$http.get('/search', {
                params: {
                    value,
                    coll: 'power',
                }
            }).then(({data}) => {
                if(!data.msg) {
					this.tableData = data
					this.lists = data
				}else {
					this.$message.error(data.msg)
				}            
            })

        }

    }
};
</script>



